<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: zjd
  Date: 2020/8/17
  Time: 10:09
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <title>News Single Page</title>
    <!-- for-mobile-apps -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name=""/>
    <!-- //for-mobile-apps -->
    <link href="${pageContext.request.contextPath}/front-style/css/bootstrap.css" rel="stylesheet" type="text/css"
          media="all"/>
    <!-- pop-up -->
    <link href="${pageContext.request.contextPath}/front-style/css/popuo-box.css" rel="stylesheet" type="text/css"
          media="all"/>
    <!-- //pop-up -->
    <link href="${pageContext.request.contextPath}/front-style/css/easy-responsive-tabs.css" rel='stylesheet'
          type='text/css'/>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/front-style/css/zoomslider.css"/>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/front-style/css/style.css"/>
    <link href="${pageContext.request.contextPath}/front-style/css/font-awesome.css" rel="stylesheet">
    <script type="text/javascript"
            src="${pageContext.request.contextPath}/front-style/js/modernizr-2.6.2.min.js"></script>
    <!--/web-fonts-->
    <link href='http://fonts.googleapis.com/css?family=Tangerine:400,700' rel='stylesheet' type='text/css'>
    <link href="http://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900" rel="stylesheet">
    <link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
    <!--//web-fonts-->
</head>
<body>
<!--/main-header-->
<!--/banner-section-->
<div id="demo-1" class="banner-inner">
    <div class="banner-inner-dott">
        <!--/header-w3l-->
        <div class="header-w3-agileits" id="home">
            <div class="inner-header-agile part2">
                <nav class="navbar navbar-default">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse"
                                data-target="#bs-example-navbar-collapse-1">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <h1><a href="${pageContext.request.contextPath}/index.jsp"><span>M</span>ovies <span>P</span>ro</a>
                        </h1>
                    </div>
                    <!-- navbar-header -->
                    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                      </div>
                    <div class="clearfix"></div>
                </nav>
                <div class="w3ls_search">
                    <div class="cd-main-header">
                        <ul class="cd-header-buttons">
                            <li><a class="cd-search-trigger" href="#cd-search"> <span></span></a></li>
                        </ul> <!-- cd-header-buttons -->
                    </div>
                    <div id="cd-search" class="cd-search">
                        <form action="#" method="post">
                            <input name="Search" type="search" placeholder="Search...">
                        </form>
                    </div>
                </div>

            </div>

        </div>
        <!--//header-w3l-->
    </div>
</div>
<!--/banner-section-->
<!--//main-header-->
<!--/banner-bottom-->
<div class="w3_agilits_banner_bootm">
    <div class="w3_agilits_inner_bottom">
        <div class="col-md-6 wthree_agile_login">
            <%--显示跳转条--%>
            <c:if test="${sessionScope.userinfo!=null}">
                <ul>
                    <li><i class="fa fa-phone" aria-hidden="true"></i> (+000) 009 455 4088</li>
                    <li><div style="width: 20px"></div></li>
                    <li><img style="height: 40px;width: 40px;margin-top: -10px" src="${pageContext.request.contextPath}/DownloadFileServlet?fileName=${sessionScope.userinfo.user_img}" alt="头像"></li>
                    <li><div style="width: 20px"></div></li>
                    <li><i>${sessionScope.userinfo.user_acount}</i></li>
                    <li><div style="width: 20px"></div></li>
                    <li><a href="javascript:void(0)" class="login" data-toggle="modal" data-target="#myModall6">个人中心</a></li>
                    <li><a class="login" href="${pageContext.request.contextPath}/userinfo/exit">退出</a></li>
                    <c:if test="${sessionScope.userinfo!=null}">
                        <li><a class="login" href="${pageContext.request.contextPath}/orders/toOrderList">订单列表</a></li>
                    </c:if>
                </ul>
            </c:if>
            <c:if test="${sessionScope.userinfo==null}">
                <ul>
                    <li><i class="fa fa-phone" aria-hidden="true"></i> (+000) 009 455 4088</li>
                    <li><a href="javascript:void(0)" class="login"  data-toggle="modal" data-target="#myModal4">登录</a></li>
                        <%--<li><a href="javascript:void(0)" class="login reg"  data-toggle="modal" data-target="#myModal5">注册</a></li>--%>

                </ul>
            </c:if>
        </div>
        <div class="col-md-6 wthree_share_agile">

        </div>
    </div>
</div>
<!--//banner-bottom-->
<!-- Modal1 -->
<div class="modal fade" id="myModal4" tabindex="-1" role="dialog">

    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4>登录</h4>
                <div class="login-form">
                    <form action="${pageContext.request.contextPath}/userinfo/login" method="post">
                        <input type="text" name="user_acount" placeholder="账号" required="">
                        <input type="password" name="user_password" placeholder="密码" required="">
                        <div class="tp">
                            <input type="submit" value="LOGIN NOW">
                        </div>
                        <div class="forgot-grid">
                            <div class="log-check">
                                <label class="checkbox"><input type="checkbox" name="checkbox">Remember me</label>
                            </div>
                            <div class="forgot">
                                <a href="#" data-toggle="modal" data-target="#myModal2">Forgot Password?</a>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- //Modal1 -->
<!-- Modal1 -->
<div class="modal fade" id="myModal5" tabindex="-1" role="dialog">

    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4>Register</h4>
                <div class="login-form">
                    <form action="#" method="post">
                        <input type="text" name="name" placeholder="Name" required="">
                        <input type="email" name="email" placeholder="E-mail" required="">
                        <input type="password" name="password" placeholder="Password" required="">
                        <input type="password" name="conform password" placeholder="Confirm Password" required="">
                        <div class="signin-rit">
														<span class="agree-checkbox">
														<label class="checkbox"><input type="checkbox" name="checkbox">I agree to your <a
                                                                class="w3layouts-t" href="#" target="_blank">Terms of Use</a> and <a
                                                                class="w3layouts-t" href="#" target="_blank">Privacy Policy</a></label>
													</span>
                        </div>
                        <div class="tp">
                            <input type="submit" value="REGISTER NOW">
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- //Modal1 -->
<!-- breadcrumb -->
<div class="w3_breadcrumb">
    <div class="breadcrumb-inner">
        <ul>
            <li><a href="${pageContext.request.contextPath}/index.jsp">主页</a><i>//</i></li>
            <li>电影简介</li>
        </ul>
    </div>
</div>
<!-- //breadcrumb -->
<!--/content-inner-section-->
<div class="w3_content_agilleinfo_inner">
    <div class="agile_featured_movies">
        <%--<div class="inner-agile-w3l-part-head">
            <h3 class="w3l-inner-h-title">订单详情</h3>
            <p class="w3ls_head_para">订单全部详情</p>
        </div>--%>
        <div class="latest-news-agile-info">
            <div class="col-md-8 latest-news-agile-left-content">
                <div class="single video_agile_player">
                    <%--影片内容--%>
                    <div class="video-grid-single-page-agileits">
                        <%--<img src="${pageContext.request.contextPath}/DownloadFileServlet?fileName=${requestScope.orders.showings.movies.movieImg}" alt="电影图片" class="img-responsive">--%>
                        <img src="${pageContext.request.contextPath}/DownloadFile?movieImg=${requestScope.mov.movieImg}" alt="${requestScope.mov.movieName}"
                             style="height: 800px;width: 700px;margin-left: 120px" class="img-responsive">
                    </div>
                    <br><br>
                    <%--<h4>${requestScope.orders.showings.movies.movieName}</h4>--%>
                    <h2 style="color: rosybrown">${requestScope.mov.movieName}</h2>
                    <br>
                    <ul class="resp-tabs-list" style="margin-left: 20px">
                        <li>
                            <a href="${pageContext.request.contextPath}/PayController/goMoviesJsp?movieNo=${requestScope.mov.movieNo}"
                               style="color: whitesmoke;font-size: 20px">购票</a></li>
                    </ul>
                    <br><br><br>
                    <div class="agile-post">
                        <%--上映于<span>${requestScope.orders.showings.movies.movieDate}</span>--%>
                        上映于<span>${requestScope.mov.movieDate}</span>
                    </div>
                    <p>
                        <%--<h3>电影简介</h3>${requestScope.orders.showings.movies.movieContent}</p>--%>
                    <h3>电影简介</h3>${requestScope.mov.movieContent}</p>
                </div>
                <div class="single-agile-shar-buttons">
                    <h3>大众评分 ：<span id="score">0</span></h3>

                </div>
                <div id="comment_status">

                </div>
                <div class="response">
                    <!-- agile-comments -->
                    <div class="agile-news-comments">
                        <div class="agile-news-comments-info">
                            <h4>评论内容</h4>
                            <div id="comment_context">
                            </div>
                            <div class="container-fluid text-center">
                                <ul class="pager" id="footlist">
                                </ul>
                            </div>
                        </div>
                    </div>
                    <!-- //agile-comments -->
                </div>

            </div>
            <div class="col-md-4 latest-news-agile-right-content">
                <h4 class="side-t-w3l-agile">最新的<span>电影</span></h4>
                <div class="side-bar-form">
                    <form action="${pageContext.request.contextPath}/PayController/goListJsp" method="post">
                        <input type="search" name="movieName" placeholder="在这里搜索..." required="required">
                        <input type="submit" value=" ">
                    </form>
                </div>
                <h3 class="side-t-w3l-agile">Hot <span>News</span></h3>
                <h4 class="side-t-w3l-agile">New <span>Trailer</span></h4>

                <div class="video_agile_player sidebar-player">
                    <div class="video-grid-single-page-agileits">
                        <div data-video="fNKUgX8PhMA" id="video1"><img src="" alt="" class="img-responsive">
                            <div id="play"></div>
                        </div>
                    </div>


                    <div class="player-text side-bar-info">
                        <p class="fexi_header">Me Before You </p>
                        <p class="fexi_header_para"><span class="conjuring_w3">Story Line<label>:</label></span>Me
                            Before You Official Trailer #2 (2016) - Emilia Clarke, Sam Claflin Movie HD

                            A girl in a small town forms an unlikely....</p>
                        <p class="fexi_header_para"><span>Release On<label>:</label></span>Feb 3, 2016 </p>
                        <p class="fexi_header_para">
                            <span>Genres<label>:</label> </span>
                            <a href="genre.html">Drama</a> |
                            <a href="genre.html">Adventure</a> |
                            <a href="genre.html">Family</a>
                        </p>
                        <p class="fexi_header_para fexi_header_para1"><span>Star Rating<label>:</label></span>
                            <a href="#"><i class="fa fa-star" aria-hidden="true"></i></a>
                            <a href="#"><i class="fa fa-star" aria-hidden="true"></i></a>
                            <a href="#"><i class="fa fa-star-half-o" aria-hidden="true"></i></a>
                            <a href="#"><i class="fa fa-star-o" aria-hidden="true"></i></a>
                            <a href="#"><i class="fa fa-star-o" aria-hidden="true"></i></a>
                        </p>
                    </div>

                </div>
                <div class="clearfix"></div>

            </div>
            <div class="clearfix"></div>
        </div>

    </div>
</div>
<!--//content-inner-section-->


<!--/footer-bottom-->
<div class="contact-w3ls" id="contact">
    <div class="footer-w3lagile-inner">
        <h2><span>下次一定影院在线系统</span></h2>
        <p class="para">不要下次一定,这就是一定.</p>
        <div class="footer-grids w3-agileits">
            <div class="col-md-2 footer-grid">
                <h4>广告位</h4>
                <ul>
                    <li><a href="javascript:void(0)">广告位招租</a></li>
                    <li><a href="javascript:void(0)">广告位招租</a></li>
                    <li><a href="javascript:void(0)">广告位招租</a></li>
                    <li><a href="javascript:void(0)">广告位招租</a></li>
                    <li><a href="javascript:void(0)">广告位招租</a></li>
                    <li><a href="javascript:void(0)">广告位招租</a></li>
                </ul>
            </div>
            <div class="col-md-2 footer-grid">
                <h4>广告位</h4>
                <ul>

                    <li><a href="javascript:void(0)">广告位招租</a></li>
                    <li><a href="javascript:void(0)">广告位招租</a></li>
                    <li><a href="javascript:void(0)">广告位招租</a></li>
                    <li><a href="javascript:void(0)">广告位招租</a></li><li><a href="javascript:void(0)">广告位招租</a></li>
                    <li><a href="javascript:void(0)">广告位招租</a></li>



                </ul>
            </div>


            <div class="col-md-2 footer-grid">
                <h4>合作单位</h4>
                <ul class="w3-tag2">
                    <li><a href="javascript:void(0)">合作单位1</a></li>
                    <li><a href="javascript:void(0)">合作单位2</a></li>
                    <li><a href="javascript:void(0)">合作单位3</a></li>
                    <li><a href="javascript:void(0)">合作单位4</a></li>
                    <li><a href="javascript:void(0)">合作单位5</a></li>
                    <li><a href="javascript:void(0)">合作单位6</a></li>
                    <li><a href="javascript:void(0)">合作单位7</a></li>
                </ul>


            </div>
            <div class="col-md-2 footer-grid">
                <h4>合作院线</h4>
                <div class="footer-grid1">
                    <div class="footer-grid1-left">
                        <a href="javascript:void(0)"><img src="${pageContext.request.contextPath}/front-style/images/1.jpg" alt=" " class="img-responsive"></a>
                    </div>
                    <div class="footer-grid1-right">
                        <a href="javascript:void(0)">左侧放logo,右侧是名字</a>

                    </div>
                    <div class="clearfix"> </div>
                </div>
            </div>
            <div class="col-md-2 footer-grid">
                <h4 class="b-log"><a href="${pageContext.request.contextPath}/index.jsp"><span>我</span>的 <span>院</span>线</a></h4>

                <div class="clearfix"> </div>
            </div>
            <div class="clearfix"> </div>
            <ul class="bottom-links-agile">
                <li><a href="javascript:void(0)" title="Font Icons" class="aiguo">民主</a></li>
                <li><a href="javascript:void(0)" title="Short Codes" class="aiguo">富强</a></li>
                <li><a href="javascript:void(0)" title="contact" class="aiguo">爱国</a></li>

            </ul>
        </div>


    </div>

</div>
<div class="w3agile_footer_copy">
    <p>制作团队 &copy; 四期三阶段.严宇 赵井东 陆亮.<a target="_blank" href="http://www.baidu.com/">有问题问百度</a></p>
</div>
<a href="#home" id="toTop" class="scroll" style="display: block;"> <span id="toTopHover"
                                                                         style="opacity: 1;"> </span></a>

<script src="${pageContext.request.contextPath}/front-style/js/jquery-1.11.1.min.js"></script>
<!-- Dropdown-Menu-JavaScript -->
<script>
    $(document).ready(function () {
        $(".dropdown").hover(
            function () {
                $('.dropdown-menu', this).stop(true, true).slideDown("fast");
                $(this).toggleClass('open');
            },
            function () {
                $('.dropdown-menu', this).stop(true, true).slideUp("fast");
                $(this).toggleClass('open');
            }
        );
    });
</script>
<!-- //Dropdown-Menu-JavaScript -->
<!-- search-jQuery -->
<script src="${pageContext.request.contextPath}/front-style/js/main.js"></script>

<script src="${pageContext.request.contextPath}/front-style/js/simplePlayer.js"></script>
<script>
    $("document").ready(function () {
        $("#video").simplePlayer();
    });
</script>
<script>
    $("document").ready(function () {
        $("#video1").simplePlayer();
    });
</script>
<script>
    $("document").ready(function () {
        $("#video2").simplePlayer();
    });
</script>
<script>
    $("document").ready(function () {
        $("#video3").simplePlayer();
    });
</script>
<script>
    $("document").ready(function () {
        $("#video4").simplePlayer();
    });
</script>
<script>
    $("document").ready(function () {
        $("#video5").simplePlayer();
    });
</script>
<script>
    $("document").ready(function () {
        $("#video6").simplePlayer();
    });
</script>

<!-- pop-up-box -->
<script src="${pageContext.request.contextPath}/front-style/js/jquery.magnific-popup.js"
        type="text/javascript"></script>
<!--//pop-up-box -->
<input placeholder="">
<div id="small-dialog1" class="mfp-hide">
    <iframe src=""></iframe>
</div>
<div id="small-dialog2" class="mfp-hide">
    <iframe src=""></iframe>
</div>
<script>
    $(document).ready(function () {
        $('.w3_play_icon,.w3_play_icon1,.w3_play_icon2').magnificPopup({
            type: 'inline',
            fixedContentPos: false,
            fixedBgPos: true,
            overflowY: 'auto',
            closeBtnInside: true,
            preloader: false,
            midClick: true,
            removalDelay: 300,
            mainClass: 'my-mfp-zoom-in'
        });

    });
</script>
<script src="${pageContext.request.contextPath}/front-style/js/easy-responsive-tabs.js"></script>
<script>
    $(document).ready(function () {
        $('#horizontalTab').easyResponsiveTabs({
            type: 'default', //Types: default, vertical, accordion
            width: 'auto', //auto or any width like 600px
            fit: true,   // 100% fit in a container
            closed: 'accordion', // Start closed if in accordion view
            activate: function (event) { // Callback function if tab is switched
                var $tab = $(this);
                var $info = $('#tabInfo');
                var $name = $('span', $info);
                $name.text($tab.text());
                $info.show();
            }
        });
        $('#verticalTab').easyResponsiveTabs({
            type: 'vertical',
            width: 'auto',
            fit: true
        });
    });
</script>
<link href="${pageContext.request.contextPath}/front-style/css/owl.carousel.css" rel="stylesheet" type="text/css"
      media="all">
<script src="${pageContext.request.contextPath}/front-style/js/owl.carousel.js"></script>
<script>
    $(document).ready(function () {
        $("#owl-demo").owlCarousel({

            autoPlay: 3000, //Set AutoPlay to 3 seconds
            autoPlay: true,
            navigation: true,

            items: 5,
            itemsDesktop: [640, 4],
            itemsDesktopSmall: [414, 3]

        });

    });
</script>

<!--/script-->
<script type="text/javascript" src="${pageContext.request.contextPath}/front-style/js/move-top.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/front-style/js/easing.js"></script>

<script type="text/javascript">
    jQuery(document).ready(function ($) {
        $(".scroll").click(function (event) {
            event.preventDefault();
            $('html,body').animate({scrollTop: $(this.hash).offset().top}, 900);
        });
    });
</script>
<script type="text/javascript">
    $(document).ready(function () {
        /*
        var defaults = {
              containerID: 'toTop', // fading element id
            containerHoverID: 'toTopHover', // fading element hover id
            scrollSpeed: 1200,
            easingType: 'linear'
         };
        */

        $().UItoTop({easingType: 'easeOutQuart'});
        /*加载数据*/
        lod();
        lodsco();
        scom();
    });
</script>
<!--end-smooth-scrolling-->
<script src="${pageContext.request.contextPath}/front-style/js/bootstrap.js"></script>
<script>
    /*个人评论加载，需要user_no用户编号，order_no订单编号*/
    function scom() {
        if (${requestScope.orders.order_no!=null}) {
            $.post("${pageContext.request.contextPath}/comments/queryDtail",
                {
                    user_no: '${requestScope.orders.user_no}',
                    order_no: '${requestScope.orders.order_no}'
                }, function (data) {
                    var context = ""
                    if (data.comment_no != 0) {
                        context += "<div style='border:1px solid;margin:20px auto;padding: 20px'><p><h1>你已经评论完了！</h1></p>" +
                            "<br><p><h3>你的评论</h3><div><p style=\" margin: 0 auto;\n" +
                            "    font-size: 20px;\n" +
                            "    color: #1926bd;\n" +
                            "    line-height: 40px;\">" + data.comment_content + "</p><div>" +
                            "<p style=\"font-family: '黑体';font-size:25px;\">你的评分：" + data.movie_score + "<a style=\"float: right;\" href='javascript:del(" + data.comment_no + ")'>删除评论</a></p><div>";
                    } else {
                        context += " <label><input id=\"movie_score\" type=\"number\" min='0' max='10' onchange='che(this)' placeholder='请输入0到10之间的数'></label><br>\n" +
                            "               <label> <input id=\"comment_content\" type=\"text\" placeholder=\"评论\"></label><br>\n" +
                            "               <label> <input type=\"button\" onclick=\"addcom()\" value=\"提交\"></label>";
                    }
                    $("#comment_status").empty();
                    $("#comment_status").append(context);
                }, "json")
        }
    }
    function che(obj) {
        var sc=$(obj).val()
        if(sc>10||sc<0){
            $(obj).val("")
        }
    }

    /*删除评论，需要comment_no评论编号*/
    function del(comment_no) {
        var b = confirm("确认删除吗？");
        if (b) {
            $.post("${pageContext.request.contextPath}/comments/delComment",
                {comment_no: comment_no},
                function (data) {
                    if (data) {
                        lod();
                        lodsco();
                        scom();
                    } else {
                        alert("删除失败")
                    }
                })
        }
    }

    /*大众评分，需要movie_no电影编号*/
    function lodsco() {
        var movie_no;
        if (${requestScope.orders.showings.movies.movieNo!=null}) {
            movie_no = '${requestScope.orders.showings.movies.movieNo}'
        }
        if (${requestScope.mov.movieNo!=null}) {
            movie_no = '${requestScope.mov.movieNo}'
        }
        $.post("${pageContext.request.contextPath}/comments/avgScore",
            {movie_no: movie_no},
            function (data) {
                $("#score").empty();
                $("#score").html(data);
            }, "json")
    }

    /*全部评论加载，需要movie_no电影编号*/
    function lod() {
        var movie_no;
        if (${requestScope.orders.showings.movies.movieNo!=null}) {
            movie_no = '${requestScope.orders.showings.movies.movieNo}'
        }
        if (${requestScope.mov.movieNo!=null}) {
            movie_no = '${requestScope.mov.movieNo}'
        }
        $.post("${pageContext.request.contextPath}/comments/queryAllByMovie",
            {movie_no: movie_no},
            function (data) {
                loddata(data)
            }, "json")
    }

    /*评论数据写入*/
    function loddata(data) {
        var context = ""
        $.each(data.list, function (index, obj) {
            context += "<hr style='border-top: 2px double beige;'><div class=\"media response-info\">\n" +
                "                                    <div class=\"media-left response-text-left\">\n" +
                "                                        <a href=\"#\">\n" +
                "                                            <img class=\"media-object\" style=\"height: 40px;width: 40px;margin-top: -10px\" src=\"${pageContext.request.contextPath}/DownloadFileServlet?fileName="+obj.userinfo.user_img+"\" alt=\"\">\n" +
                "                                        </a>\n" +
                "                                        <h5><a href=\"#\">" + obj.userinfo.user_acount + "</a></h5>\n" +
                "                                    </div>\n" +
                "                                    <div class=\"media-body response-text-right\">\n" +
                "                                        <p style='font-family: 华文琥珀'>" + obj.comment_content + "</p>\n" +
                "                                        <ul>" +
                "                                            <li>评论时间：" + obj.comment_date.substring(0, obj.comment_date.length-2) + "</li>" +
                "                                            <li>评分：" + obj.movie_score + "</li>\n" +
                /*                "                                            <li><a href=\"single.html\"><i class=\"fa fa-reply\" aria-hidden=\"true\"></i> Reply</a></li>\n" +*/
                "                                        </ul>\n" +
                "                                    </div>\n" +
                "                                    <div class=\"clearfix\"> </div>\n" +
                "                                </div>"
        })
        context += "<div class='clearfix'> </div>\n";
        $("#comment_context").empty()
        $("#comment_context").append(context)

        $("#footlist").empty()
        if (data.isFirstPage) {
            $("#footlist")
                .append(
                    "<li class=\"page-item disabled\"><a class=\"page-link\" href=\"javascript:void(0)#\">首页</a></li>")
        } else {
            $("#footlist")
                .append(
                    "<li class=\"page-item\"><a class=\"page-link\" onclick=\"frpage()\">首页</a></li>")
        }

        if (data.isFirstPage) {
            $("#footlist")
                .append(
                    "<li class=\"page-item disabled\"><a class=\"page-link\" href=\"javascript:void(0)\">上一页</a></li>")
        } else {
            $("#footlist").append(
                "<li class=\"page-item\"><a class=\"page-link\" onclick=\"topage("
                + (data.pageNum - 1) + ")\">上一页</a></li>")
        }
        for (i = 1; i <= data.pages; i++) {
            if (i == data.pageNum) {
                $("#footlist").append(
                    "<li class=\"page-item active disabled\"><a class=\"page-link\">"
                    + i + "</a></li>")
            } else {
                $("#footlist").append(
                    "<li class=\"page-item\"><a class=\"page-link\" onclick=\"topage("
                    + i + ")\">" + i + "</a></li>")
            }
        }
        if (data.pageNum == data.pages) {
            $("#footlist")
                .append(
                    "<li class=\"page-item disabled\"><a class=\"page-link\" href=\"javascript:void(0)\">下一页</a></li>")
        } else {
            $("#footlist").append(
                "<li class=\"page-item\"><a class=\"page-link\" onclick=\"topage("
                + (data.pageNum + 1) + ")\">下一页</a></li>")
        }
        if (data.pageNum == data.pages) {
            $("#footlist")
                .append(
                    "<li class=\"page-item disabled\"><a class=\"page-link\">末页</a></li>")
        } else {
            $("#footlist").append(
                "<li class=\"page-item\"><a class=\"page-link\" onclick=\"enpage("
                + data.totalPage + ")\">末页</a></li>")
        }
        /*$("#footlist")
            .append(
                "<li class=\"page-item\"><input id=\"tonum\" style=\"width:50px;\" type=\"number\" min=\"1\" value=" + data.pageNum + " max=" + data.pages + " class=\"page-link\"/>")
        $("#footlist")
            .append(
                "<input style=\"width:80px;\" class=\"btn btn-danger\" type=\"buutton\" value=\"跳转\" onclick=\"tonumpage("
                + data.pages
                + ","
                + data.pageNum
                + ")\"/>")*/
    }
</script>
<script>
    function topage(i) {
        var movie_no;
        if (${requestScope.orders.showings.movies.movieNo!=null}) {
            movie_no = '${requestScope.orders.showings.movies.movieNo}'
        }
        if (${requestScope.mov.movieNo!=null}) {
            movie_no = '${requestScope.mov.movieNo}'
        }
        $.post("${pageContext.request.contextPath }/comments/queryAllByMovie",
            {
                movie_no: movie_no,
                pageNum: i
            }, function (result) {
                loddata(result)
            }, "json")
    }

    //首页
    function frpage() {
        topage(1)
    }

    //尾页
    function enpage(enpage) {
        topage(enpage)
    }

    //跳转
    function tonumpage(totl, page) {
        num = $("#tonum").val();
        if (num > 0 && num <= totl) {
            topage(num)
        } else {
            $("#tonum").val(page);
        }
    }

    /*增加评论，需要movie_no电影编号,user_no用户编号,order_no订单编号,movie_score电影评分,comment_context电影评论*/
    function addcom() {
        var sc = $("#movie_score").val()
        var st=$("#comment_content").val()
        if (sc > 10 || sc < 0) {
            $("#movie_score").val("")
        }
        if(sc!=""||st!=""){
            if (${requestScope.orders.order_no!=null}) {
                $.post("${pageContext.request.contextPath}/comments/addComment",
                    {
                        movie_no: '${requestScope.orders.showings.movies.movieNo}',
                        user_no: '${requestScope.orders.user_no}',
                        order_no: '${requestScope.orders.order_no}',
                        movie_score: $("#movie_score").val(),
                        comment_content: $("#comment_content").val()
                    }
                    , function (data) {
                        if (data) {
                            lod();
                            lodsco();
                            scom();
                        }
                    }, "json")
            }
        }
    }

    $("input").focus(function () {
        $(this).parent("label").addClass("active");
    });
    $("input").blur(function () {
        if ($(this).val() == "") {
            $(this).parent("label").removeClass("active");
        }
    })
</script>
</body>
<style>
    input {
        width: 100%;
        height: 40px;
        border: 1px solid #dbdbdb;
        outline: none;
        font-size: 20px;
        text-indent: 10px;
    }

    label {
        position: relative;
        width: 400px;
        margin: 10px auto;
        display: inline-block;
    }

    label:after {
        content: "";
        display: inline-block;
        width: 0;
        height: 2px;
        background: red;
        transition: width 1s;
        position: absolute;
        bottom: 1px;
        left: 1px;
    }

    .active:after {
        width: calc(100% - 2px)
    }
</style>
</html>